import {Component, OnDestroy, ViewChild} from '@angular/core';
import {Router} from '@angular/router';
import {ModalDirective} from "ngx-bootstrap";
import {Observable} from "rxjs/Observable";
import {BaseAuthenticateComponent} from "../../../components/baseAuthenticateComponent";
import {User} from "../../../entity/User";
import {MessageService} from "../../../service/messageService";
import {UserService} from "../../../service/userService";
import {UserCreateAction} from "../../../store/action/user/app/UserCreateAction";
import {UserDeleteAction} from "../../../store/action/user/app/UserDeleteAction";
import {UserUpdateCompleteAction} from "../../../store/action/user/data";
import {UserCreateCompleteAction} from "../../../store/action/user/data/UserCreateCompleteAction";
import {UserDeleteCompleteAction} from "../../../store/action/user/data/UserDeleteCompleteAction";
import {Store} from "../../../store/Store";
import "rxjs/add/operator/filter";
import "rxjs/add/operator/do";
import "rxjs/add/operator/debounceTime";
import "rxjs/add/operator/takeUntil";
import {AbstractAppAction, AbstractDataAction, ActionType} from "../../../store/action";
import {UserListAction, UserUpdateAction} from "../../../store/action/user/app";
import {Subject} from "rxjs/Subject";
import {DialogService} from "../../../service/dialogService";

@Component({
    templateUrl: 'user.component.html'
})
export class UserComponent extends BaseAuthenticateComponent implements OnDestroy {

    @ViewChild('editModal') public editModal: ModalDirective;
    @ViewChild('createModal') public createModal: ModalDirective;

    users: Observable<User[]>;
    userToEdit: User = new User();
    userToCreate: User = new User();
    listAction: AbstractAppAction;

    searchSteam = new Subject<string>();
    searchTerm = "";

    private unsubscribe: Subject<void> = new Subject();

    constructor(protected _router: Router,
                public _dialogService: DialogService,
                private _userService: UserService,
                private store: Store) {
        super(_router, _dialogService);
    }

    ngOnDestroy() {
        this.unsubscribe.next();
        this.unsubscribe.complete();
    }

    ngAfterViewInit() {
        this.listAction = new UserListAction(this._userService);
        this.store.dispatch(this.listAction);

        this.users = this.store.actionSteam$
            .takeUntil(this.unsubscribe)
            .filter((a: AbstractDataAction) => a.type === ActionType.DATA && a.data_type === "USER_LIST_COMPLETE")
            .do(() => {
                this.editModal.hide();
                this.createModal.hide();
            })
            .map(action => action.payload);

        // update complete
        this.store.actionSteam$
            .takeUntil(this.unsubscribe)
            .filter((a: AbstractDataAction) => a.type === ActionType.DATA && a.data_type === "USER_UPDATE_COMPLETE")
            .subscribe(() => this.store.dispatch(new UserListAction(this._userService)));

        // delete complete
        this.store.actionSteam$
            .takeUntil(this.unsubscribe)
            .filter((a: AbstractDataAction) => a.type === ActionType.DATA && a.data_type === "USER_DELETE_COMPLETE")
            .subscribe(() => this.store.dispatch(new UserListAction(this._userService)));

        // create complete
        this.store.actionSteam$
            .takeUntil(this.unsubscribe)
            .filter((a: AbstractDataAction) => a.type === ActionType.DATA && a.data_type === "USER_CREATE_COMPLETE")
            .subscribe(() => this.store.dispatch(new UserListAction(this._userService)));

        // dismiss edit modal while error
        this.store.actionSteam$
            .takeUntil(this.unsubscribe)
            .filter(a => a.type === ActionType.ERROR)
            .subscribe(() => this.editModal.hide());
    }

    editUser(user: User) {
        this.userToEdit = user;
        this.editModal.show();
    }

    createUser() {
        this.userToCreate = new User();
        this.createModal.show();
    }

    deleteUser(user: User) {
        this.store.dispatch(new UserDeleteAction(this._userService, user));
    }

    create() {
        this.store.dispatch(new UserCreateAction(this._userService, this.userToCreate));
    }

    update() {
        this.store.dispatch(new UserUpdateAction(this._userService, this.userToEdit));
    }

}
